@charset "utf-8";
@import "../../../layout/sass/_mixin-fun.scss";

.column{
	width: 100%;
	margin-top: 80px;
	> .inner{
		div[ui-view] {
			width: 100%;
			position: relative;
			margin-bottom: 120px;
			min-height: 400px;
			img.loading {
				position: absolute;
				top: 50%;
				left: 50%;
				width: 300px;
				height: 136px;
				margin-top: -68px;
				margin-left: -150px;
			}
		}
		#verify-form {
			margin-top: 20px;
		}
		.step{
			width: 50%;
			height: 75px;
			float: left;
			text-align: center;
			color: #888888;
			&.w3 {
				width: 33.3333%;
			}
			.number{
				font-size: 36px;
				line-height: 75px;
			}
			.chinese{
				font-size: 24px;
				line-height: 75px;
			}
			&.active {
				color: $global-color;
				border-bottom: 2px solid $global-color;
			}
		}
		.long{
			width: 1020px;
			margin-bottom: 0px;
			margin-top: 0px;
		}
		.validate{
			margin-top: 110px;
			margin-left: 320px;
			.phone-num{
				padding-left: 18px;
				margin-top: 30px;
				height: 30px;
				position: relative;
				.label-cn {
					line-height: 30px;
				}
				.tips {
					position: absolute;
					margin-top: 0;
					top: 0;
					left: 328px;
					padding: 0;
					line-height: 30px;
					height: 30px;
					padding-left: 26px;
					color: #a7a7a7;
					.icon {
						position: absolute;
						top: 50%;
						left: 0;
						margin-top: -8px;
					}
				}
				
			}
			.identify-code{
				height: 30px;
				padding-left: 18px;
				margin-top: 20px;
			}
			
			.trans{
				margin-top: 10px;
				width: 130px;
				text-align: center;
				font-size: 14px;
				margin-left: 8px;
				height: 40px;
			}
			.confirm{
				font-size: 18px;
				margin-top: 22px;
				margin-left: 94px;
				text-align: center;
				height: 40px;
				width: 120px;
				border-radius: 3px;
			}
			.tips{
				font-size: 14px;
				color: #888888;
				padding-left: 94px;
				margin-top: 20px;
			}
		}//validate

		.account{
			margin-left: 320px;
			.top10{
				margin-top: 10px;
			}
			.top40{
				margin-top: 20px;
			}
			.invisible{
				border-bottom-style: none;
			}
			.clearfix {
				position: relative;
			}
			.agreement {
				display: none;
				position: fixed;
				z-index: 5;
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;
				.bg {
					width: 100%;
					height: 100%;
					background: #000;
					opacity: 0.5;
					filter: Alpha(opacity=50);
				}
				.insilde {
					position: absolute;
					top: 50%;
					left: 50%;
					width: 750px;
					height: 480px;
					margin-top: -240px;
					margin-left: -375px;
					background: white;
					z-index: 5;
					.head {
						height: 40px;
						background: #de4a4a;
						line-height: 40px;
						font-size: 16px;
						color: white;
						padding-left: 40px;
					}
					.dis {
						margin-top: 20px;
						padding: 0 15px;
						height: 360px;
						overflow-y: scroll;
					}
					.btns {
						width: 100%;
						height: 40px;
						margin-top: 20px;
						button {
							height: 30px;
							display: block;
							margin: 0 auto;
							width: 120px;
							border-radius: 4px;
							background: #de4a4a;
							color: white;
							font-size: 14px;
						}
					}
				}
			}
			.tips {
				position: absolute;
				margin-top: 0;
				top: 20px;
				left: 350px;
				padding: 0;
				height: 30px;
				line-height: 30px;
				padding-left: 26px;
				color: #a7a7a7;
				.icon {
					position: absolute;
					top: 50%;
					left: 0;
					margin-top: -8px;
				}
				.rt-fa{
					margin-top: -8px;
					position: absolute;
					top: 50%;
					left: 4px;
				}
				span[ng-bind="psdSten"] {
					color: rgba(223,72,72,1);
				}
			}
			.left{
				width: 111px;
				height: 30px;
				margin-top: 20px;
				line-height: 30px;
				padding-left: 18px;
			}
			.right{
				padding-left: 18px;
				margin-top: 20px;
				height: 30px;
				line-height: 30px;
				&.first {
					color: rgba(220,75,78,1);
					font-weight: 800;
					font-size: 18px;
				}
				input {
					margin-left: 0;
				}
				.trans{
					width: 80px;
					text-align: center;
					font-size: 14px;
					margin-left: 8px;
					height: 30px;
				}
			}
			.text{
				font-size: 16px;
			}
			.width245{
				width: 270px;
				margin-left: 131px;
				padding-left: 22px;
				color: #aaaaaa;
				font-size: 14px;
				line-height: 40px;
				position: relative;
				.rt-fa{
					margin-top: -8px;
					position: absolute;
					top: 50%;
					left: 0px;
				}
				span{
					a{
						color: #de4a4a;
					}
				}
			}
			.next{
				width: 160px;
				font-size: 18px;
				text-align: center;
				height: 40px;
				margin-left: 130px;
				border-radius: 4px;
				margin-top: 20px;
			}
		}//account
		.success-long {
			position: absolute;
			top: 75px;
			left: 0;
		}
		.success{
			position: absolute;
			width: 100%;
			top: 0;
			left: 0;
			.move {
				position: relative;
				height: 228px;
			}
			.longer{
				width: 100%;
				background-color: #a7a7a7;
				height: 1px;
				margin-top: 50px;
				position: relative;
				.widerod{
					width: 200px;
					height: 4px;
					border: 0;
					background-color: #a7a7a7;
					position: absolute;
					bottom: -4px;
					left: 310px;
				}
			}
			.top{
				font-size: 24px;
				color: #de4a4a;
				width: 100%;
				text-align: center;
			}
			
			.butn{
				border: 1px solid #a7a7a7;
				background-color: #ffffff;
				color: #a7a7a7;
				font-size: 18px;
				width: 160px;
				height: 40px;
				margin-left: 345px;
				margin-top: 37px;
				&.clik{
					background-color: #de4a4a;
					color: #ffffff;
					border: none;
					border-top-left-radius: 4px;
					border-bottom-left-radius: 4px;
				}
			}

			.left0{
				margin-left: -3px;
				border-left: none;
				border-top-right-radius: 4px;
				border-bottom-right-radius: 4px;
			}

			.belowl{
				width: 230px;
				font-size: 14px;
				color: #a7a7a7;
				margin-left: 290px;
				margin-top: 33px;
				cursor: pointer;
				.business{
					font-size: 20px;
					width: 220px;
					text-align: center;
					position: relative;
				}
				.action{
					text-align: center;
					width: 220px;
					margin-top: 20px;
				}
				.left310{
					margin-left: 310px;
				}
				.left347{
					margin-left: 347px;
				}
				input[type='radio']{
				    display: none;
				}
				label{
					display: block;
					width: 16px;
					height: 16px;
				    cursor: pointer;
				    background: url(/img/icons.png) no-repeat -216px 0;
				    position: absolute;
				    top: 50%;
				    margin-top: -8px;
				    left: 28px;
				}
				&.active, &.active:hover {
					color: rgba(222,74,74,1);
					a {
						color: rgba(222,74,74,1);
					}
					.business {
						font-size: 24px;
					}
					label{
						width: 22px;
						height: 22px;
						margin-top: -11px;
						left: 12px;
						background: url(/img/icons.png) no-repeat -344px -21px;
					}
				}
				&:hover {
					.business {
						font-size: 22px;
					}
					label{
						width: 22px;
						height: 22px;
						margin-top: -11px;
						left: 12px;
						background: url(/img/icons.png) no-repeat -320px -21px;
					}
				}
				.divdeal{
					cursor: pointer;
					position: relative;
				}
				a{
					color: #a7a7a7;
				}
			}

			.belowr{
				@extend .belowl;
				margin-left: 0;
			}

			button.fill{
				width: 160px;
				height: 40px;
				font-size: 18px;
				background: rgba(222,74,74,1);
				color: white;
				display: block;
				position: absolute;
				bottom: -140px;
				left: 50%;
				margin-left: -80px;
				border-radius: 4px;
				&[disabled="disabled"] {
					color: #a7a7a7;
					border: 1px solid #a7a7a7;
					background-color: #ffffff;
				}
			}
		}//success
		form .write{
			height: 30px;
			width: 220px;
			margin-left: 18px;
			border-left-style: none;
			border-right-style: none;
			border-top-style:  none;
			border-bottom: 1px solid $global-color;
			color: #888888;
			font-size: 16px;
		}
		input {
			&::-webkit-input-placeholder, &::-moz-placeholder, &:-ms-input-placeholder {
				color: #cacaca;
			}
		}
		.label-cn{
			color: #ad8959;
			font-size: 18px;
			width: 111px;
		    height: 30px;
		    margin-bottom: 20px;
		    line-height: 30px;
		    padding-left: 18px;
			span.must {
				color: #de4a4a;
				margin-right: 3px;
			}
		}
		.btn{
			border: none;
			background-color: #de4a4a;
			color: #ffffff;
			&[disabled="disabled"] {
				background: #a7a7a7;
			}
		}
	}
}